<!--
用于展示资源加载出错的信息
@author pan
@createDate 2022/02 2022/2/26 22:22
-->
<script setup lang="ts" name="UnHandlerErrorContent">
export interface ResourceErrorInfoType {
  tagName: string
  src: string | undefined
  link: string | undefined
  alt: string | undefined
}

defineProps<{
  errorInfo: ResourceErrorInfoType
}>()
</script>

<template>
  <ul class="errorContent">
    <li>
      <strong>标签:</strong><span>{{ errorInfo.tagName }}</span>
    </li>
    <li>
      <strong>src值:</strong><span>{{ errorInfo.src }}</span>
    </li>
    <li>
      <strong>link值:</strong><span>{{ errorInfo.link }}</span>
    </li>
    <li>
      <strong>alt值:</strong><span>{{ errorInfo.alt }}</span>
    </li>
  </ul>
</template>

<style lang="scss" scoped>
.errorContent {
  list-style: none;
  margin: 0;
  padding: 0;
  span {
    font-size: 12px;
  }
  strong {
    display: inline-block;
    margin-right: 5px;
    font-size: 12px;
  }
}
</style>
